<template>
  <view>
    <template
      v-if="settings.customer && settings.customer.users && settings.customer.users.length > 0"
    >
      <button
        class="customer-btn"
        @click="showOnlineServiceDialog = true"
      >
        <slot></slot>
      </button>
      <dialog-x
        title="在线客服列表"
        :visible.sync="showOnlineServiceDialog"
      >
        <view
          class="customer"
          :style="[globalStyle]"
        >
          <view
            v-for="(item, index) in settings.customer.users"
            :key="index"
            class="customer-item"
            @click="contectUser(item)"
          >
            <view> <text class="iconfont icon-user-fill mr-10"></text>{{ item.name }}</view>
            <view> <text class="iconfont icon-comment-filling"></text></view>
          </view>
        </view>
      </dialog-x>
    </template>
    <template v-else>
      <button
        class="customer-btn"
        open-type="contact"
        bindcontact="handleContact"
      >
        <slot></slot>
      </button>
    </template>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        showOnlineServiceDialog: false,
      };
    },

    methods: {
      contectUser(item) {
        //如果是微信小程序
        // #ifdef MP-WEIXIN
        //跳转到企业微信客服
        wx.openCustomerServiceChat({
          extInfo: { url: item.url },
          corpId: this.settings.customer.app_id,
          success(res) {},

          fail(res) {
            console.log(res);
          },
        });
        // #endif

        // 如果是微信公众号
        // #ifdef H5
        window.open(item.url);
        // #endif
      },
    },
  };
</script>

<style lang="scss" scoped></style>
